<template>
	<view>
		<view class="imgbox" style="padding-top: 200rpx;padding-bottom: 60rpx;">
			<u--image width="300rpx" height="300rpx" :src="logo"></u--image>
		</view>
		<view class="" style="padding: 0 30rpx;">
			<u--form :model="data" ref="uForm">
				<u-form-item v-for="(item,index) in inputs" :key="index">
					<view class="u-flex" style="height: 100rpx;flex:1">
						<u-input v-model="data[item.value]" :placeholder="item.placeholder" :type="item.type" />
					</view>
				</u-form-item>

			</u--form>
			<view style="height: 60rpx;">

			</view>
			<u-button type="primary" :disabled="btndisabled" :loading="loading" @click="login">登录</u-button>

		</view>
		<verifyslide ref="verifyslide" @success="verifySuccess"></verifyslide>
	</view>
</template>

<script>
	import logo from "@/static/logo.png"
	import qs from "qs"
	import verifyslide from "./components/VerifySlide.vue"
	import {
		setToken,
		setRefreshToken
	} from '@/config/storage'
	import {
		weBtoa
	} from "@/z/function/btoa.js"
	export default {
		components: {
			verifyslide
		},
		data() {
			return {
				logo,
				loading: false,
				data: {
					// admin 123456
					username: "",
					password: "",
				},
				inputs: [{
					value: "username",
					placeholder: "用户名"
				}, {
					value: "password",
					type: "password",
					placeholder: "密码"
				}]
			}
		},
		computed: {
			btndisabled() {
				for (let i in this.data) {
					if (this.data[i] == "") {
						return true
					}
				}
				return false
			}
		},
		mounted() {

		},
		methods: {
			verifySuccess(params) {
				console.log(params)
				debugger
				let data = {
					code: params.captchaVerification,
					grant_type: "password",
					randomStr: "blockPuzzle",
					scope: "server",
					...this.data
				}
				data.grant_type = 'password';
				data.scope = 'server';

				const basicAuth = 'Basic ' + weBtoa('pig:pig');
				console.log(basicAuth, "basicAuth")
				// Session.set('basicAuth', basicAuth);
				// 密码加密
				const encPassword = this.$z.ase2(data.password, 'pigxpigxpigxpigx');
				let {
					username,
					randomStr,
					code,
					grant_type,
					scope
				} = data;
				this.$z.request({
					url: `/auth/oauth2/token?${qs.stringify({
						username,
						randomStr,
						code,
						grant_type,
						scope,
					})}`,
					method: 'post',
					data: {

						password: encPassword
					},
					header: {
						skipToken: true,
						Authorization: basicAuth,
						"Content-Type": 'application/x-www-form-urlencoded', //自定义请求头信息
					},
				}).then(res => {
					setToken(res["access_token"])
					setRefreshToken(res["refresh_token"])
					uni.navigateTo({
						url: "/pages/index/index"
					})
				});
				console.log(basicAuth, encPassword, username,
					randomStr,
					code,
					grant_type,
					scope, "params");
			},
			registerfn() {
				uni.navigateTo({
					url: "/pages/login/register/register"
				})
			},
			async login() {
				this.$refs.verifyslide.show()
				// this.loading = true;
				// try {
				// 	await this.$store.dispatch("user/applogin", this.data)
				// 	this.loading = false;
				// } catch (e) {
				// 	//TODO handle the exception
				// 	this.loading = false;
				// }
			}
		}
	}
</script>

<style lang="scss" scoped>
	.register {
		height: 60rpx;
		color: #2093f5;
	}

	.imgbox {
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>